/*********************************************************样式重置********************************************************/
/*以下用到的元素有magrin*/
body, p, section, h2, h3, h4, h5, nav, header {
    margin: 0;
}

/*image在IE下会有边框，且使图片居中*/
image {
    border: none;
    vertical-align: middle;
}

/*去除项目符号*/
ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/*表单样式重置*/
input {
    margin: 0;
    padding: 0;
}

/*设置页面的字体*/
body {
    font-size: 14px;
    font-family: "微软雅黑", serif;
}

a {
    text-decoration: none;
}

/******************************************************抽象页面常用的类*****************************************************/
/*清除浮动*/
.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

/*页面居中部分*/
.center {
    width: 1181px;
    margin: 0 auto;
}

/******************************************************header************************************************************/
header {
    margin-bottom: 18px;
}

/******************************************************header下的login***************************************************/
/*左上角登录框*/
.login {
    text-align: right;
    padding: 2px 0;
}

.login a {
    font: 12px/21px "微软雅黑";
    padding: 0 10px 0 12px;
    color: #646e72;
    border-right: 1px solid #f2f2f2;
}

.login img {
    vertical-align: top;
}

.login a.nobordr {
    border: none;
}

/******************************************************搜索框************************************************************/
.searchBox {
    float: left;
    font-size: 0;
}

.logo {
    float: left;
    margin: 5px 14px 0 2px;
}

.searchBox p {
    padding-bottom: 10px;
}

.searchBox p a {
    font: 14px/14px "微软雅黑";
    color: #555555;
    margin-right: 14px;
}

.searchBox .text {
    height: 32px;
    width: 453px;
    font: 14px/32px "微软雅黑";
    border: 1px solid #b8b8b8;
    vertical-align: top;
}

/*解决btn和text之间的空格*/
.searchBox div {
    font-size: 0;
}

/*不给高度，使用行高撑开，使得与text高度一致*/
.searchBox .btn {
    width: 97px;
    font: 16px/32px "微软雅黑";
    border: 1px solid #cccccc;
    border-left: none;
    margin-right: 13px;
    background: url("../images/line_bg.gif") repeat-x;
}

.searchBox .ask {
    font: 14px/32px "微软雅黑";
    color: #427ce0;
    text-decoration: underline;
}

/******************************************************nav************************************************************/
nav {
    height: 40px;
    background: url("../images/nav_bg.gif") repeat-x;
}

nav .center div {
    float: right;
}

nav ul {
    float: left;
}

nav ul li {
    float: left;
    padding: 0 70px;
    border-right: 1px solid #09a800;
}

nav li a {
    font: 18px/40px "微软雅黑";
    color: #fff;
}

nav li a.active, nav li a:hover {
    color: #faff64;
}

nav .center div a {
    color: #fff;
    font: 16px/40px "微软雅黑";
    /*这里是有padding是由于padding可以有背景，而margin不可以*/
    padding-left: 23px;
    margin-right: 30px;
    background: url("../images/ico_03.gif") no-repeat left;
}

nav .center div a.phone {
    background: url("../images/ico_02.gif") no-repeat left;
}

/******************************************************banner部分********************************************************/
#banner {
    /*这里的高度应该给到center，因为center中的元素都是定位的，如果不给定center高度，center是撑不开的*/
    /*height: 400px;*/
    background: #efecda url("../images/banner.jpg") no-repeat center;
}

/*方便下面做定位*/
#banner .center {
    height: 400px;
    position: relative;
}

/*title部分*/
#banner .title {
    /*算出padding值后需要做相应的减法*/
    width: 496px;
    height: 56px;
    /*这个值是根据行高进行计算的*/
    padding: 2px 0 6px 7px;
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 220px;
}

#banner .title h2 {
    font: 30px/37px "微软雅黑";
}

#banner .title h2 a {
    color: #fff;
}

#banner .title span {
    font: 12px/19px "微软雅黑";
}

#banner .title span a {
    color: #fff;
}

#banner ul {
    position: absolute;
    bottom: 20px;
    /*设置为dispaly：table后需要设置宽度*/
    width: 100%;
}

#banner li {
    width: 236px;
    float: left;
    /*右面实际距离为27-28px，但是一个空格为8个像素，所以padding-right=20px*/
    padding: 7px 20px 7px 7px;
    background: rgba(255, 255, 255, 0.9);
    margin-right: 18px;
    /*li相当于table*/
    display: table;
}

#banner li img {
    float: left;
    margin-right: 13px;
}

#banner li a {
    font: 15px/24px "微软雅黑";
    color: #373c35;
}

#banner li p {
    /*相当于table的行*/
    display: table-cell;
    vertical-align: middle;
}

.solgin {
    width: 270px;
    position: absolute;
    top: 20px;
    right: 0;
    background: #fdfdfb;
    padding-top: 15px;

}

.subTitle {
    margin: 0 20px 0 20px;
    border-bottom: 1px dotted #bfbfbd;
}

.subTitle h3 {
    font: bold 16px/39px "微软雅黑";
    color: #474747;
    float: left;
}

.subTitle a {
    float: right;
    line-height: 39px;

}

.solgin .text {
    font: 24px/38px "微软雅黑";
    color: #42c166;
    margin: 45px 20px 34px 17px;
    background: url("../images/know_bg.gif") no-repeat right;
}

.solgin .number {
    font: 12px/42px "微软雅黑";
    color: #3e434b;
    text-align: center;
    vertical-align: middle;
}

.solgin .number span {
    font-size: 23px;
    color: #e96c29;
    margin: 0 13px 0 8px;
    vertical-align: middle;
}

.solgin .know {
    font: 12px/32px "微软雅黑";
    text-align: center;
    margin-bottom: 25px;
}

.solgin .know a {
    color: #787878;
    text-decoration: underline;
}

.solgin .subNav {
    height: 60px;
    background: #59cd78;
    text-align: center;
    font-size: 0;
}

.solgin .subNav a {
    color: #fff;
    font: 16px/60px "微软雅黑";
    padding-left: 17px;
    background: url("../images/ico_05.gif") no-repeat left;
}

.solgin .subNav a.answer {
    background: url("../images/ico_06.gif") no-repeat 50px;
    padding-left: 70px;
}

/******************************************************fist部分**********************************************************/
#fist {
    margin: 50px auto;
}

#fist .heat {
    width: 350px;
    padding: 9px 13px 7px 13px;
    background: #f8f8f8;
    float: left;
}

.heat .img {
    /*width: 350px;*/
    height: 250px;
    margin: 10px auto;
    position: relative;
}

.heat .img .title {
    position: absolute;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.5);
    height: 38px;
    width: 100%;
    text-align: center;
    color: #fff;
    font: 14px/38px "微软雅黑";
}

.heat li {
    font: 14px/31px "微软雅黑";
    background: url("../images/ico_07.gif") no-repeat 7px 14px;
    padding-left: 23px;
}

.heat li a {
    color: #585858;
}

/******************************************************hot部分***********************************************************/
.hot {
    width: 442px;
    float: left;
    margin: 0 40px;
}

.hot h4 {
    font: 18px/24px "微软雅黑";
    color: #070000;
}

.hot .img {
    margin: 18px 0 20px 0;
}

.hot .img img {
    float: left;
    margin-right: 14px;
}

.hot .img h5 {
    font: 18px/30px "微软雅黑";
}

.hot .img h5 a {
    color: #000605;
}

.hot .img p {
    padding-top: 3px;
    font: 12px/20px "微软雅黑";
    color: #89938c;
}

.hot li {
    font: 14px/36px "微软雅黑";
    padding-left: 16px;
    background: url("../images/ico_07.gif") no-repeat left 17px;
}

.hot li a {
    color: #635a55;
}

/******************************************************hot部分***********************************************************/
.public {
    width: 282px;
    float: right;
}

.public h4 {
    font: 18px/24px "微软雅黑";
    color: #070000;
}

.public ul {
    padding: 11px 0 10px 0;
}

.public li {
    font: 14px/32px "微软雅黑";
    padding-left: 22px;
    background: url("../images/ico_07.gif") no-repeat 2px 15px;
}

.public li a {
    color: #343633;
}

.public h4.shopTitle {
    font: 18px/44px "微软雅黑";
}

.public img {
    border: 1px solid #e5e5e5;
}

/******************************************************second部分***********************************************************/
#second .ask {
    float: left;
    width: 376px;
}

#second .ask .title {
    font-size: 0;
    margin-bottom: 32px;
}

#second .ask .title h3 {
    font: 18px/28px "微软雅黑";
    display: inline-block;
    color: #080000;
    vertical-align: middle;
}

#second .ask .title strong {
    color: #32b594;
    font: 12px/20px "微软雅黑";
    padding: 0 6px;
    border: 1px solid #ebebeb;
    margin: 0 8px;
    border-radius: 5px;
    vertical-align: middle;
}

#second .ask .title span {
    font: 12px/28px "微软雅黑";
    color: #9790a5;
    vertical-align: middle;
}

#second .ask .box {
    border: 1px solid #e8e8e8;
}

#second .ask .box .bTitle {
    padding: 0 10px;
    font-size: 0;
}

#second .ask .box .bTitle span {
    font: 14px/40px "微软雅黑";
    color: #000000;
}

#second .ask .box .bTitle a {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 10px;
    background: url("../images/ico_08.gif");
}

#second .ask .box .bTitle strong {
    float: right;
    font: 12px/40px "微软雅黑";
    color: #ff6374;
    padding-left: 28px;
    background: url("../images/ico_09.gif") no-repeat left center;
}

#second .ask .box p {
    height: 136px;
    font: 14px/26px "微软雅黑";
    padding: 0 20px;
    /*居中设置，多行文字垂直居中*/
    display: table-cell;
    vertical-align: middle;
}

#second .ask .box p a {
    color: #010000;
}

#second .ask .btn {
    height: 62px;
    background: #f7f7f7;
    text-align: center;
}

#second .ask .btn a {
    width: 146px;
    display: inline-block;
    font: 18px/40px "微软雅黑";
    color: #fff;
    background: #49ca6d;
    border-radius: 4px;
    position: relative;
    top: 11px;
}

#second .list {
    float: left;
    width: 442px;
    margin: 0 40px;
}

#second .list .more {
    font: 12px/28px "微软雅黑";
    text-align: right;
}

#second .list .more a {
    color: #868c88;
}

#second .list ul {
    padding-top: 16px;
    background: url("../images/list_bg.gif") repeat-y 9px;
}

#second .list li {
    height: 39px;
    line-height: 39px;
    background: url("../images/ico_10.gif") no-repeat 4px 13px;
    padding-bottom: 13px;
    font-size: 0;
}

#second .list li strong {
    font-size: 12px;
    padding-left: 27px;
    color: #9a9190;
    margin-right: 22px;
}

/*这里设置dispaly是为了使边框整齐*/
#second .list li span {
    width: 347px;
    display: inline-block;
    font-size: 16px;
    border-bottom: 1px dotted #b9b9b9;
}

#second .list li span a {
    color: #357bd1;
}

#second .list li span.noborder {
    border: none;
}

#second .img {
    float: right;
}

#second .img img {
    display: block;
    border: 1px solid #e5e5e5;
}

.marignBottom {
    margin-bottom: 10px;
}

/******************************************************user************************************************************/
#user {
    margin: 50px 0 43px 0;
    padding: 18px 0 48px 0;
    background: #f3f3f3;
}

.userImg {
    float: left;
}

.userImg h3 {
    font: 18px/62px "微软雅黑";
    color: #000000;
}

.userImg li {
    width: 268px;
    float: left;
    text-align: center;
}

.userImg li.second {
    margin: 0 25px;
}

.userImg li.fist .top {
    background: url("../images/userbg_01.jpg") no-repeat;
}

.userImg li.second .top {
    background: url("../images/userbg_02.jpg") no-repeat;
}

.userImg li.third .top {
    background: url("../images/userbg_03.jpg") no-repeat;
}

.userImg li .top {
    padding-top: 30px;
    border: 1px solid #eeecef;
    border-bottom: none;
}

.userImg li .top h4 {
    color: #ffffff;
    font: 26px/40px "微软雅黑";
}

.userImg li .top p {
    padding: 0 60px;
    color: #ffffff;
    font: 12px/24px "微软雅黑";
}

.userImg li .top img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    display: block;
    margin: 20px auto 15px;
}

.userImg li .top a {
    color: #fff;
    font-size: 14px;
    display: block;
    padding-bottom: 14px;
}

.userImg li .bottom {
    width: 266px;
    padding: 2px 0;
    border: 1px solid #e1e1e1;
}

.userImg li .bottom p {
    font: 12px/37px "微软雅黑";
    color: #000000;
}

.userImg li .bottom a {
    display: block;
    height: 38px;
    width: 122px;
    font: 14px/38px "微软雅黑";
    color: #34b565;
    border: 1px solid #e1e1e1;
    margin: 0 auto 18px;
}

.rank {
    width: 283px;
    float: right;
    padding-top: 22px;
}

.rank .title {
    margin-top: 6px;
}

.rank .title h4 {
    font: 20px/55px "微软雅黑";
    color: #000000;
    float: left;
}

.rank .title div {
    float: right;
    font-size: 0;
}

.rank .title div span {
    font: 12px/55px "微软雅黑";
}

.rank .title div span.caina {
    color: #35bb4c;
    border-right: 1px solid #dbdce1;
    padding: 0 17px 0 19px;
    margin-right: 17px;
}

.rank ul {
    background: url(../images/ol_bg.gif) no-repeat 0 10px;
}

.rank li {
    height: 34px;
    line-height: 34px;
    padding-left: 32px;
}

.rank li a {
    display: inline-block;
    width: 152px;
    color: #343537;
}

.rank li span {
    display: inline-block;
    width: 63px;
    color: #bf968b;
}

.rank li span.color {
    color: #4dcf88;
}

/******************************************************行家部分***********************************************************/
#expert {
    padding: 44px 0 50px 0;
}

#expert .left {
    float: left;
    width: 521px;
}

#expert .left .title {
    height: 60px;
    color: #93888e;
    font: 12px/60px "微软雅黑";
}

#expert .left .Ltitle {
    float: left;
}

#expert .left .Ltitle h3 {
    display: inline-block;
    font: 18px/60px "微软雅黑";
    color: #000000;
}

#expert .left .Ltitle span {
    color: #32b561;
    font: 12px/18px "微软雅黑";
    padding: 0 6px;
    border: 1px solid #eaeaea;
    border-radius: 4px;
    margin: 0 8px;
}

#expert .left .Rtitle {
    font: 12px/60px "微软雅黑";
    float: right;

}

#expert .left .Rtitle a {
    color: #93888e;
}

#expert .left .Rtitle .change {
    border-right: 1px solid #dadada;
    padding: 0 11px 0 17px;
    margin: 0 13px 0 0;
    background: url("../images/ico_08.gif") no-repeat left center;
}

#expert .left li {
    width: 248px;
    float: left;
}

#expert .left li p {
    height: 110px;
    font: 18px/28px "微软雅黑";
    padding: 0 20px;
    display: table-cell;
    vertical-align: middle;
    border: 1px solid #e9e9e9;
    border-bottom: none;
    background: url("../images/photo_bg.gif") no-repeat bottom;
}

#expert .left li p a {
    color: #333230;
}

#expert .left li div {
    text-align: center;
    padding: 37px 0 20px 0;
    background: #f5fff6;
    border: 1px solid #e9e9e9;
    border-top: none;
}

.photo {
    width: 137px;
    height: 116px;
    margin: 0 auto;
    display: block;
    background: url(../images/photo_bg.png);
}

.photo img {
    border-radius: 50%;
}

.userName {
    margin-top: 11px;
    display: block;
    font: 18px/26px "微软雅黑";
    color: #3b3036;
}

#expert .left li div span {
    font: 12px/26px "微软雅黑";
    color: #52b358;
}

#expert .right {
    float: right;
    width: 602px;
}

#expert .right .title {
    font: 18px/60px "微软雅黑";
    border-bottom: 1px solid #eaeaea;
}

#expert .right .title h3 {
    display: inline-block;
    float: left;
    font-weight: normal;
}

#expert .right .title a {
    font-size: 12px;
    color: #8e8983;
    float: right;
}

#expert .right ul {
    background: url("../images/img_10.jpg") no-repeat right center;
}

#expert .right li {
    font: 12px/50px "微软雅黑";
    padding-left: 25px;
    background: url("../images/ico_07.gif") no-repeat 8px 22px;
}

#expert .right li a {
    color: #4f5f5c;
}

/******************************************************slider***********************************************************/

#slider {
    padding-bottom: 42px;
}

#slider .center {
    border-top: 2px solid #dadada;
    padding-top: 29px;
    position: relative;
    height: 177px;
}

.LeftBtn, .RightBtn {
    position: absolute;
    height: 50px;
    width: 27px;
    top: 78px;
    cursor: pointer;
}

.LeftBtn {
    background: url("../images/leftBtn_bg.gif");
    left: 26px;
}

.RightBtn {
    background: url("../images/rightBtn_bg.gif");
    right: 26px;
}

.classify {
    position: absolute;
    left: 117px;
}

#slider .classify div {
    float: left;
    margin-right: 63px;
    width: 188px;
}

#slider .classify div .bg1 {
    background: url("../images/img_11.jpg") no-repeat;
}

#slider .classify div .bg2 {
    background: url("../images/img_12.jpg") no-repeat;
}

#slider .classify div .bg3 {
    background: url("../images/img_13.jpg") no-repeat;
}

#slider .classify div .bg4 {
    background: url("../images/img_14.jpg") no-repeat;
}

#slider .classify div h3 {
    padding-left: 73px;
    font: bold 20px/65px "微软雅黑";
}

#slider .classify div h3 a {
    color: #000000;
}

#slider .classify div li {
    float: left;
    font: 14px/28px "微软雅黑";
    width: 94px;
}

#slider .classify div li a {
    color: #000000;
}

/******************************************************subNav************************************************************/
#subNav {
    background: #f3f3f3;
}

#subNav .center {
    font-size: 0;
    padding: 50px 0 45px;
}

#subNav .center div {
    display: inline-block;
    width: 215px;
    position: relative;
    left: 128px;
}

#subNav .center div.bg2 {
    text-align: center;
    padding: 0 70px;
    border-left: 1px solid #dadada;
    border-right: 1px solid #dadada;
    margin: 0 70px;
}

#subNav .center div h3 {
    text-align: left;
    font: 24px/45px "微软雅黑";
}

#subNav .center div h3 a {
    color: #7f8289;
}

#subNav .center .bg1 {
    padding-left: 34px;
    background: url("../images/ico_13.gif") no-repeat left 9px;
}

#subNav .bg2 h3 {
    padding-left: 39px;
    background: url(../images/ico_14.gif) no-repeat left 9px;
}

#subNav .center .bg3 {
    padding-left: 34px;
    background: url("../images/ico_15.gif") no-repeat left 9px;
}

#subNav .center div li {
    display: inline-block;
    width: 107px;
    font: 12px/28px "微软雅黑";
    float: left;
    text-align: left;
}

#subNav .center div li a {
    color: #7f8289;
}

/******************************************************footer************************************************************/

footer {
    background: #e9e9e9;
    height: 64px;
    text-align: center;
    font: 12px/64px "微软雅黑";
}

footer a {
    color: #2b62b5;
    margin: 0 10px;
}

